﻿using System;

namespace RexToy.UI.Controls
{
    public class Dialog : Container
    {
        protected Palette __background;
        public Palette Background
        {
            get { return __background; }
            set
            {
                var template = "ui-body-{0}";
                this.__domNode.ReplaceClass(StringExt.Format(template, this.__background), StringExt.Format(template, value));
                this.__background = value;
            }
        }

        protected DialogResult __dialogResult;
        public DialogResult DialogResult
        {
            get { return __dialogResult; }
        }

        public override Palette Palette
        {
            get
            {
                return __palette;
            }
            set
            {
                var template = "ui-body-{0}";
                var container = this.__domNode.SearchByName("container");
                container.ReplaceClass(StringExt.Format(template, this.__palette), StringExt.Format(template, value));

                var btnX = this.__domNode.SearchByName("X");
                template = "ui-btn-up-{0}";
                btnX.ReplaceClass(StringExt.Format(template, this.__palette), StringExt.Format(template, value));

                var head = this.__domNode.SearchByName("head");
                template = "ui-bar-{0}";
                head.ReplaceClass(StringExt.Format(template, this.__palette), StringExt.Format(template, value));

                this.__palette = value;
            }
        }

        private TransitionMode _transition;
        private bool show = false;
        public string[] events = new string[] { "onclose" };
        private string inClass;
        private string outClass;

        public Dialog(string head, TransitionMode? transition)
        {
            __background = Palette.A;
            __dialogResult = DialogResult.None;
            __dragEventBubble = false;
            this.__palette = Palette.B;
            this._transition = transition ?? RexToy.UI.Controls.TransitionMode.SlideDown;
            this.outClass = StringExt.Format("{0} out reverse", this._transition);
            this.inClass = StringExt.Format("{0} in", this._transition);
            this.__domNode = RexToy.UI.Controls.DomNode.Create(new DomNodeCreateOptions()
            {
                tag = Tag.Div,
                className = "ui-dialog ui-page ui-body-a ui-page-active",                
                items = new DomNodeCreateOptions[] {
                new DomNodeCreateOptions(){
                    tag= Tag.Div,
                    hashName= "head",
                    className= "ui-corner-top ui-overlay-shadow ui-bar-b ui-header",
                    items= new DomNodeCreateOptions[]{
                        new DomNodeCreateOptions(){
                            tag= Tag.A,
                            hashName= "X",
                            className= "ui-btn-left ui-btn ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-b",
                            title= "Close",
                            items= new DomNodeCreateOptions[] {
                                new DomNodeCreateOptions(){
                                    tag= Tag.Span,
                                    className= "ui-btn-inner ui-btn-corner-all",
                                    items = new DomNodeCreateOptions[]{
                                        new DomNodeCreateOptions(){
                                            tag= Tag.Span,
                                            className= "ui-btn-text"
                                        },
                                        new DomNodeCreateOptions(){
                                            tag= Tag.Span,
                                            className= "ui-icon ui-icon-delete ui-icon-shadow"
                                        }
                                    }
                                }
                            }
                        },
                        new DomNodeCreateOptions(){
                            tag= Tag.H1,
                            className= "ui-title",
                            innerHTML= head
                        }
                    }
                },
                new DomNodeCreateOptions(){
                    tag= Tag.Div,
                    hashName= "container",
                    className= "ui-content ui-body-b ui-corner-bottom ui-overlay-shadow"
                }
            }
            });
            __domNode["data-role"] = "dialog";
            this.__domNode.Height = RexToy.UI.Global.Window.GetScrollSize().Height;
            var x = this.__domNode.SearchByName("X");
            x.AttachEvent(DomEvent.OnMouseOver, new Action(this._mouseover).Bind(this));
            x.AttachEvent(DomEvent.OnMouseOut, new Action(this._mouseout).Bind(this));
            x.AttachEvent(DomEvent.OnClick, new Action(this._onclick).Bind(this));

            RexToy.UI.Global.Window.AttachEvent("onresize", new Action(this._resize).Bind(this));

            //this.__domNode._element.addEventListener("webkitAnimationEnd", this.__webkit_animEnd.bind(this));
            this.__domNode.AttachEvent("webkitAnimationEnd", new Action(this.__webkit_animEnd).Bind(this));
        }

        public void _resize()
        {
            this.__domNode.Height = RexToy.UI.Global.Window.GetScrollSize().Height;
        }

        private void _mouseover()
        {
            var x = this.__domNode.SearchByName("X");
            var oldname = StringExt.Format("ui-btn-up-{0}", this.__palette);
            var newname = StringExt.Format("ui-btn-over-{0}", this.__palette);
            x.ReplaceClass(oldname, newname);
        }

        private void _mouseout()
        {
            var x = this.__domNode.SearchByName("X");
            var newname = StringExt.Format("ui-btn-up-{0}", this.__palette);
            var oldname = StringExt.Format("ui-btn-over-{0}", this.__palette);
            x.ReplaceClass(oldname, newname);
        }

        private void _onclick()
        {
            this.__dialogResult = RexToy.UI.Controls.DialogResult.None;
            this.Close();
        }

        public void Show()
        {
            this.show = true;
            this.__domNode.ReplaceClass(this.outClass, this.inClass);

            this.__domNode.GetStyle().Display = System.Html.DOM.CSS.Display.Block;
            this.Render(RexToy.UI.Global.Window.GetSize());            
        }

        private void __webkit_animEnd()
        {
            if (!this.show)
            {
                this.__domNode.GetStyle().Display = System.Html.DOM.CSS.Display.None;
                this.Destroy();
            }
        }

        public void Close()
        {
            this.show = false;
            this.__domNode.ReplaceClass(this.inClass, this.outClass);

            if (!RexToy.UI.Capability.CssTransitions)
            {
                this.__domNode.GetStyle().Display = System.Html.DOM.CSS.Display.None;
                this.Destroy();
            }
            this.__FireEvent("onclose");
        }
    }
}
